/* isquirrelplayer.js
 * 
 * Description: The in-page YouTube video player.
 * 
 * iSquirrel
 * 2009
 * Imperial College London
 */

var player;

/*
 * This function gets called when the YouTube player is ready to receive js calls.
 */
function onYouTubePlayerReady(playerId) {
      var ytplayer = document.getElementById("isquirrelobjplayer");
      player.registerPlayerObject(ytplayer).play();
}

var Player = Class.create({
	
	initialize: function(){
	/*
	 * init the player
	 */
		this._playerobject = null;
		this._frame = null;
		this._isplaying = false;
		this._id = null;
		this._title = null;
	},
	
	register: function(){
	/*
	 * registers the player elements and event listeners on the document body
	 */
	
		// the outer container -- player frame
		var playerframe = new Element('div');
		playerframe.id="isquirrelplayer";
		
		this._frame = playerframe;
		
		// the element which is going to get replaced by the SWFOject 
		var swfdiv = new Element('div');
		swfdiv.id = 'ytapiplayer';
		
		var draggablecontainer = new Element('div');
		draggablecontainer.id = 'draggablecontainer';
		
		// close button
		var closebtn = new Element('div');
		closebtn.id="pclosebtn";
		
		var yticon = new Element('div');
		yticon.id="youtubeicon";
		
		var title = new Element('div');
		title.id="youtubetitle";
		
		var ilike = new Element('a').addClassName("ilikevidbtn");
		ilike.id="ilikevidbtn";
				
		draggablecontainer.insert({bottom: yticon});
		draggablecontainer.insert({bottom: closebtn});
		draggablecontainer.insert({bottom: title});
		draggablecontainer.insert({bottom: ilike});
		
		// construct the player
		playerframe.insert({bottom: swfdiv});
		playerframe.insert({bottom: draggablecontainer});
		
		// hide the player
		playerframe.setStyle({display:"none"});

		// put the player on the screen -- but it is not shown till we actually load it
		document.body.appendChild(playerframe);
		
		// make our player draggable
		new Draggable('isquirrelplayer',{handle: 'draggablecontainer'}); 
			
		Event.observe('pclosebtn', "click", function(e){
			
			if (this._playerobject !== null){
				this._playerobject.stopVideo();
				this._isplaying = false;
				this.reconstruct();
			}
			
	    	$("ilikevidbtn").removeClassName("likedvidbtn").addClassName("ilikevidbtn");
			$('isquirrelplayer').setStyle({display: "none"});
			
			Event.stop(e);
			
		}.bind(this));
		
	},
	
	load: function (liked, id, title){
		/*
		 * displays the player, loads the video with id 'id', and embeds the swfobject in the player
		 */
		
		this._id = id;
		this._title = title;
		
		if (this._isplaying === true){
			this.reconstruct();
		}
		
		if (this._isplaying === false){
				
			var top = (document.documentElement.clientHeight /2) - (480/2);
			var left = (document.documentElement.clientWidth /2) - (640/2);
			var scrollxy = this.getScrollXY();
			this._frame.setStyle({top: scrollxy.y + top - 55 +"px", left:left+"px"});
			
			$('isquirrelplayer').appear({duration: 0.6});

		}
	    var params = { allowScriptAccess: "always" };
	    var atts = { id: "isquirrelobjplayer" };
	    swfobject.embedSWF("http://www.youtube.com/v/" + id + "?enablejsapi=1", 
	                       "ytapiplayer", "640", "480", "8", null, null, params, atts);
	    
	    $("youtubetitle").update(title);
	    
	    if ((liked === 0) && ($(id + "_liked_locally").innerHTML === "n")){
	    	$("ilikevidbtn").writeAttribute({onclick: "like(1,this, 'http://www.youtube.com/watch?v=" + id + "','" + title + "','" + id + "',1)"});
	    }
	    else{
	    	$("ilikevidbtn").removeClassName("ilikevidbtn").addClassName("likedvidbtn");
	    }
	    return this;
	    
	    // after this method is called, the onYouTubePlayerReady() function will get called when the player is ready

	},
	
	registerPlayerObject: function(obj){
		
		this._playerobject = obj;
		return this;
		
	},
	
	play: function(){
		
		this._playerobject.playVideo();
		this._isplaying = true;
		
		return this;
		
	},
	
	reconstruct: function(){
					
		$('isquirrelobjplayer').remove();
		var swfdiv = new Element('div');
		swfdiv.id = 'ytapiplayer';
		this._frame.insert({top: swfdiv});
			
		return this;
		
	},
	
	getScrollXY: function() {
		  var scrOfX = 0, scrOfY = 0;
		  if( typeof( window.pageYOffset ) == 'number' ) {
		    //Netscape compliant
		    scrOfY = window.pageYOffset;
		    scrOfX = window.pageXOffset;
		  } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
		    //DOM compliant
		    scrOfY = document.body.scrollTop;
		    scrOfX = document.body.scrollLeft;
		  } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
		    //IE6 standards compliant mode
		    scrOfY = document.documentElement.scrollTop;
		    scrOfX = document.documentElement.scrollLeft;
		  }
		  return { x: scrOfX, y:scrOfY };
		}
	
});

player = new Player();

